<template>
    <ul class="showItemList">
        <li>
            <label>收货人</label>
            <div class="address">{{orderDetail.shippingName}} {{orderDetail.shippingPhone}}</div>
        </li>
        <li>
            <label>收货地址</label>
            <div class="address">{{orderDetail.shippingAddress}}</div>
        </li>
    </ul>
</template>

<script>
import { reactive,toRefs,getCurrentInstance } from 'vue'
import {useRoute,useRouter} from 'vue-router'
import { useStore } from 'vuex'
export default {
    props:{
        orderDetail:Object
    },
    components:{
        
    },
    setup(props,context){
        const router = useRouter()
        const route = useRoute()
        const store = useStore()
        const {proxy} = getCurrentInstance()

        const state = reactive({
            
        })

        return{
            ...toRefs(state)
        }
    }
}
</script>

<style lang="scss" scoped>
    .showItemList{
        list-style: none;
        font-size: 30px;
        li{
            display: flex;
            border-bottom:1px solid rgba(255, 255, 255, 0.2) ;
            padding: 20px 0;
            label{
                font-weight: normal;
                width: 170px;
                color: rgba(255, 255, 255, 0.8);
            }
            .address{
                flex: 1;
                font-weight: 500;
            }
        }
    }
</style>